@use 'sass:map';
@use '../../../../../../node_modules/@angular/material/index' as mat;
@use '../../../../../../node_modules/@gravitee/ui-particles-angular/index' as gio;
@use '../../../../../scss/gio-layout' as gio-layout;

:host {
  @include gio-layout.gio-responsive-content-container;
}

.subscriptions {
  &__filters {
    display: flex;
    flex-direction: column;
    margin-bottom: 8px;

    &__header__button {
      margin-left: auto;
    }

    &__inputs {
      display: flex;
      flex-direction: row;
      gap: 8px;
      &__field {
        flex: 1;
        padding-bottom: 0;
      }
    }
  }

  &__table {
    width: 100%;

    &__name {
      cursor: pointer;
    }

    &__actions {
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
    }

    .mat-column-securityType {
      white-space: nowrap;
    }

    .mat-column-actions {
      width: 0;
    }

    .mat-column-name {
      width: 30%;
    }

    .loader {
      gio-loader {
        height: 50px;
        width: 50px;
        margin: 0 auto;
      }
    }
  }

  &__apiKeys {
    margin-top: 16px;
    display: block;
  }
}
